<template>
  <div>
    <!-- 购物商品详情页的数量选择框，可写 -->
    <div class="mui-numbox" data-numbox-min="1" :data-numbox-max="m_stock">
      <button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
      <input class="mui-input-numbox" type="text" value="1" @change="getValue">
      <button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
    </div>
  </div>
</template>

<script>
import mui from '../../lib/mui/js/mui.min.js'
export default {
  data() {
    return {
      // selectNum:1
    };
  },
  props:["m_stock"],
  mounted(){
    mui(".mui-numbox").numbox();
  },
  methods: {
    
    getValue(){
      var selectNum = mui(".mui-numbox").numbox().getValue()
      // 进来数字框默认为1，且不点加减按钮或者不输入数量，getValue()此方法不会调用，取不到值
      // console.log(selectNum)
      this.$emit("getSelectNum",selectNum)
    }
  }
};
</script>

<style lang="scss" scoped>
.mui-numbox {
    border: none;
    background: #eee;
    height: 20px;
    .mui-input-numbox {
      background: #eee;
      border: none !important;
      font-size: 12px;
    }
  }
</style>
